<template>
	<el-dialog :title="titleMap[mode]" v-model="visible" :width="1500" destroy-on-close @closed="$emit('closed')" align-center>
        <el-container>
            <el-header>
                <div class="left-panel">
                </div>
                <div class="right-panel">
                    <div class="right-panel-search">
                        <el-input style="margin:5px 10px" v-model="search.company_name" placeholder="请输入收款账户" clearable @keyup.enter="upsearch"></el-input>
                        <el-button type="primary" icon="el-icon-search" @click="upsearch">搜索</el-button>
                        <el-button type="primary" icon="el-icon-refresh" @click="refresh">重置</el-button>
                    </div>
                </div>
            </el-header>
            <el-main class="nopadding">
                <scTable ref="table" row-key="id" :apiObj="apiObj" border height="600" :params="query">
                    <el-table-column width="1"></el-table-column>
                    <el-table-column label="项目编号" prop="project.project_code" align="center"></el-table-column>
                    <el-table-column label="项目名称" prop="project.metting" align="center"></el-table-column>
                    <el-table-column label="公司名称" prop="customer.company_name" align="center"></el-table-column>
                    <el-table-column label="应收金额" prop="collect.collect_account" align="center"></el-table-column>
                    <el-table-column label="回款金额" prop="money" align="center"></el-table-column>
                    <!-- <el-table-column label="付款人名称" prop="pay_name" align="center"></el-table-column> -->
                    <el-table-column label="付款时间" prop="pay_time" align="center"></el-table-column>
                    <el-table-column label="收款账户" prop="company.company_name" align="center"></el-table-column>
                    <el-table-column label="收款方式" prop="pay_type" align="center">
                        <template #default="scope">
                            <div v-if="scope.row.pay_type == 1">公户</div>
                            <div v-if="scope.row.pay_type == 2">微信(支付宝)</div>
                            <div v-if="scope.row.pay_type == 3">银行卡</div>
                            <div v-if="scope.row.pay_type == 4">二维码</div>
                        </template>
                    </el-table-column>
                    <el-table-column label="回款凭证" prop="pay_files" align="center">
                        <template #default="scope">
                            <el-image class="img" v-if="scope.row.pay_files" :src="scope.row.pay_files" :preview-src-list="scope.row.pay_files" fit="cover" preview-teleported="true" hide-on-click-modal />
                        </template>
                    </el-table-column>
                </scTable>
            </el-main>
        </el-container>
		<template #footer>
			<el-button @click="visible = false">取 消</el-button>
		</template>
	</el-dialog>
</template>

<script>
export default {
    props:{
        query: { type: String, default: "" },
    },
	emits: ['success', 'closed'],
	data() {
		return {
			mode: "add",
			titleMap: {
				add: '查看回款记录',
				edit: '编辑产品',
				show: '查看'
			},
			visible: false,
			isSaveing: false,
			apiObj: this.$API.project.payment.list,
			selection: [],
			search: {
				company_name: null,
			},
		}
	},
	mounted() {
	},
	methods: {
		//显示
		open(mode = 'add') {
			this.mode = mode;
			this.visible = true;
			return this
		},
        //搜索
		upsearch() {
			this.$refs.table.upData(this.search)
		},
        refresh(){
            for (const key in this.search) {
                this.search[key] = null;
            }
            this.$refs.table.upData(this.search)
        },
        selectionChange() {
			// this.$emit('success', selection)
            // this.visible = false;
		},
	}
}
</script>

<style></style>
